html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    width:100%;
    padding:0;
    margin:0;
}
body {
    padding: 0;
    margin: 0;
}
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}
hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
}
pre {
    font-family: monospace, monospace;
    font-size: 1em;
}
a {
    background-color: transparent;
    text-decoration:none;
}
ul,li{list-style:none;}
b,
strong {
    font-weight: bolder;
}
small {
    font-size: 80%;
}
img {
    border-style: none;
}
button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
}
button,
input {
    overflow: visible;
}
button,
select {
    text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
}
fieldset {
    padding: 0.35em 0.75em 0.625em;
}
legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal;
}
progress {
    vertical-align: baseline;
}
textarea {
    overflow: auto;
}
[type="checkbox"],
[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}
template {
    display: none;
}
[hidden] {
    display: none;
}
.iconfont {
    width: 1em; height: 1em;
    vertical-align:-1px;
    fill: currentColor;
    overflow: hidden;
}
.el-select .el-input,.el-form-item.small .el-select .el-input{width: 130px;}
.input-with-select .el-input-group__prepend {background-color: #fff;}
.el-image img,img{width:100%;}
.el-form .el-select .el-input {width: 380px;}
.icon_index,.icon_clear,.icon_refund,.icon_orders,.icon_page,.icon_bought,.icon_stocks,.icon_finacial,.icon_goods,.icon_customers,.icon_articles,.icon_systems,.icon_webs,.icon_logs,.icon_send,.icon_supplier{
    width: 1em;
    height: 1em;
    vertical-align: -.15em;
    display:inline-block;
    fill: currentColor;
    overflow: hidden;
    margin-right: 5px;
}
.icon_orders{background:url(/images/icons/orders.png) no-repeat;background-size:100%;}
.icon_index{background:url(/images/icons/home.png) no-repeat;background-size:100%;}
.icon_bought{background:url(/images/icons/bought.png) no-repeat;background-size:100%;}
.icon_stocks{background:url(/images/icons/stocks.png) no-repeat;background-size:100%;}
.icon_finacial{background:url(/images/icons/finacial.png) no-repeat;background-size:100%;}
.icon_goods{background:url(/images/icons/goods.png) no-repeat;background-size:100%;}
.icon_customers{background:url(/images/icons/customers.png) no-repeat;background-size:100%;}
.icon_articles{background:url(/images/icons/articles.png) no-repeat;background-size:100%;}
.icon_systems{background:url(/images/icons/systems.png) no-repeat;background-size:100%;}
.icon_webs{background:url(/images/icons/webs.png) no-repeat;background-size:100%;}
.icon_logs{background:url(/images/icons/logs.png) no-repeat;background-size:100%;}
.icon_send{background:url(/images/icons/send.png) no-repeat;background-size:100%;}
.icon_supplier{background:url(/images/icons/supplier.png) no-repeat;background-size:100%;}
.icon_page{background:url(/images/icons/page.png) no-repeat;background-size:100%;}
.icon_clear{background:url(/images/icons/clear.png) no-repeat;background-size:100%;}
.icon_refund{background:url(/images/icons/refund.png) no-repeat;background-size:100%;}
.search-block,.search_block{
    .el-form-item{
        margin-bottom:12px;
        .el-form-item__label,.el-form-item__content{line-height:35px;font-size:12px;}
        .el-date-editor{line-height:35px;height:35px;input{height:33px;line-height:33px;}.el-icon-date,.el-range-separator{line-height:28px;}}
        input{height:35px;line-height:35px;font-size:12px;}
        .el-select .el-input {width: 198px;}
    }
}
.el-select .el-input {width: 100%;}
#app{
    padding:0;margin:0;font-size:14px;
    .page{
        width:100%;height:100vh;position:relative;background:#f6f6f6;overflow:hidden;
        .warning-row{background:rgba(245, 108, 108, .3);color:#999;}
        .danger-row{color:#f56c6c;}
        .dark-row{background:#f7f7f7;color:#ccc;}
        .light-row{background:rgba(187, 187, 187, 0.3);}
        .success-row{background:rgba(211, 255, 211, .3);}
        .primary-row{background:rgba(190, 200, 247, .3);}
        .page_navbar{
            width:100%;position:relative;z-index:1;height:118px;box-shadow:0px 1px 2px #888;
            .nav_top{
                height:56px;padding:5px 0;overflow-x:hidden;background:linear-gradient(to left,#ee4800 0%,#ffcc00 50%,#ffcc00 100%);
                .el-image{height:52px;padding-left:20px;}
                .info{
                    padding:0 15px;display: inline-flex;float: right;height:56px;
                    .iconfont{width:28px;height:28px;}
                    .el-link{color:#fff;}
                    .el-divider{margin:22px 12px 0 12px;background-color:#fff;}
                    .el-avatar{width:35px;height:35px;margin:8px 5px 0 0;}
                }
            }
            .nav_menu{
                .top_menu{
                    background:#e8e8e8;padding:0 20px;
                    .el-menu-item{
                        border-bottom:none;color:#333;text-align:center;height:51px;line-height:50px;position:relative;
                    }
                    .el-menu-item:hover{font-weight:bold;background:none;}
                    .el-menu-item.is-active{font-weight:bold;}
                }
            }
        }
        .page_sidebar{
            position:fixed;left:0;width:168px;height:calc(100% - 118px);min-height:518px;border:1px solid #666;;box-shadow: 3px 3px 3px #666;margin-top:5px;
        }
        .page_content{
            position:relative;height:calc(100% - 118px);min-height:500px;margin-left:178px;padding:0 18px;width:calc(100% - 188px);
            &.full_content{width:calc(100% - 36px);margin: 0;}
            .page_bread{
                height: 30px;line-height:33px;margin-top: 5px;
                .el-breadcrumb{display:inline-block;}
                .now_time{text-align:right;padding-right: 18px;color:#666;}
                .tags_viewed{
                    border-bottom:1px solid #aaa;
                    .tags-view-item{
                        &:not(:first-child){margin-left:15px;}
                        display:inline-block;cursor: pointer;height:26px;line-height:26px;border: 1px solid #d8dce5;color:#666;padding: 0 8px;font-size:12px;
                        &.active{background-color: #f37000;color: #fff;border-color: #f37000;}
                    }
                    .contextmenu {
                        margin: 0;
                        background: #fff;
                        z-index: 3000;
                        position: absolute;
                        list-style-type: none;
                        padding: 5px 0;
                        border-radius: 4px;
                        font-size: 12px;
                        font-weight: 400;
                        color: #333;
                        box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, .3);
                        li {
                            margin: 0;
                            padding: 7px 16px;
                            cursor: pointer;
                            &:hover {
                                background: #eee;
                            }
                        }
                      }
                }
            }
            .main_content{
                background:#fff;height:calc(100% - 118px);overflow-y:auto;border-radius:10px;padding:18px 30px 0;
                .option_block{
                    .el-button{padding: 7px 15px;font-size: 12px;}
                    .el-link{color:#fff;}
                }
                .el-pagination{padding-top:18px;}
            }
            .page_footer{
                position:absolute;bottom:0;height:30px;text-align: center;width:calc(100% - 36px);color: #888;font-size:12px;
                .iconfont{vertical-align:-1px;}
                .el-link{vertical-align:0;color:#888;font-size:12px;}
                .el-image{vertical-align:-2px;}
            }
        }
    }
}
